<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring4-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:th="http://www.thymeleaf.org">
	<head>
		<div th:replace="commons/html-header"></div>
	</head>
	<body class="skin-1">

	<div th:replace="commons/head"></div>



	<div class="main-container" id="main-container">

		<script type="text/javascript">

			try{gds.settings.check('main-container' , 'fixed')}catch(e){}

		</script>

		<div class="main-container-inner">

			<a class="menu-toggler" id="menu-toggler" href="#">

				<span class="menu-text"></span>

			</a>



			<div th:replace="admin/admin-menu"></div>

			<div class="main-content">

				<div class="breadcrumbs" id="breadcrumbs">

					<script type="text/javascript">

						try{gds.settings.check('breadcrumbs' , 'fixed')}catch(e){}

					</script>



					<ul class="breadcrumb">
						<li>
							<i class="icon-home home-icon"></i>
							<a href="#">Home</a>
						</li>
						<li class="active">
							<a>接口管理</a>
						</li>
					</ul><!-- .breadcrumb -->

				</div>
				<div class="page-content">

					<div class="page-header">
						<form class="form-inline" role="form">
							<div class="form-group">
								<label class="sr-only" for="c_APP_ID">所属应用</label>
								<select class="form-control" id="c_APP_ID">
									<option value=""> 全部 </option>
									<option th:each="app:${appList}" th:value="${app.c_APP_ID}" th:text="${app.c_APP_NAME}"></option>
								</select>
							</div>
							<div class="form-group">
								<label class="sr-only" for="c_INTERF_NAME">接口名称</label>
								<input type="text" class="form-control" id="c_INTERF_NAME" placeholder="请输入接口名称" />
							</div>
							<div class="form-group">
								<label class="sr-only" for="c_INTERF_STATUS">状态</label>
								<select class="form-control" id="c_INTERF_STATUS">
									<option value=""> 全部 </option>
									<option th:each="dict:${interfStatusList}" th:value="${dict.c_DICT_ITEM_VALUE}" th:text="${dict.c_DICT_ITEM_NAME}"></option>
								</select>
							</div>
							<button type="button" id="btn-search" class="btn btn-sm btn-info"><i class="icon-search"></i>查询</button>
						</form>

					</div>

					<div class="row">

						<div class="col-xs-12">
							<div class="table-responsive">

								<table id="tbl" class="table table-striped table-bordered table-hover">
									<thead>
									<tr>
										<th class="center">序号</th>
										<th>接口名称</th>
										<th>应用名称</th>
										<th>HTTP方法</th>
										<th colspan="2">请求路径</th>
										<th>审批类型</th>
										<th>状态</th>
									</tr>
									</thead>
									<tbody>

									</tbody>
								</table>
							</div><!-- /.table-responsive -->
						</div><!-- /.col -->

					</div><!-- /.row -->

				</div><!-- /.page-content -->

			</div><!-- /.main-content -->

		</div><!-- /.main-container-inner -->
		<a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
			<i class="icon-double-angle-up icon-only bigger-110"></i>
		</a>

	</div><!-- /.main-container -->



	<!-- basic scripts -->
	<div th:replace="commons/html-js"></div>

	<!-- inline scripts related to this page -->

	<script>
		var c_APP_ID;
		var c_INTERF_NAME;
		var c_INTERF_STATUS;
		var dataList = null;

		queryForList = function() {
		    var reqdata = {};
		    if ('' != c_APP_ID) {reqdata.c_APP_ID = c_APP_ID;}
		    if ('' != c_INTERF_NAME) reqdata.c_INTERF_NAME = c_INTERF_NAME;
		    if ('' != c_INTERF_STATUS) reqdata.c_INTERF_STATUS = c_INTERF_STATUS;

		    $.post(contextPath + "/interf/list" , reqdata , function (data) {
		        var html = '';
		        //<![CDATA[
				if (null != data && data.length > 0) {
                    dataList = data;
				   for (var i = 0; i<data.length; i ++) {
                       html += '<tr>';
				       html += ('' +
					   '<td class="center">' + (i+1) + '</td>' +
					   '<td><div title="' + data[i].c_INTERF_NAME + '">' + data[i].c_INTERF_NAME + '</div></td>' +
					   '<td><div title="' + data[i].c_APP_NAME + '">' + data[i].c_APP_NAME + '</div></td>' +
					   '<td><div title="' + data[i].c_INTERF_HTTP_METHOD + '">' + data[i].c_INTERF_HTTP_METHOD + '</div></td>' +
					   '<td colspan="2"><div title="' + data[i].c_INTERF_METHOD_NAME + '">' + data[i].c_INTERF_METHOD_NAME + '</div></td>' +
					   '<td><div title="' + data[i].c_INTERF_AUDIT_TYPE + '">' + (null == data[i].c_INTERF_AUDIT_TYPE ? '' : data[i].c_INTERF_AUDIT_TYPE) + '</div></td>' +
					   '<td><div title="' + data[i].c_INTERF_STATUS_NAME + '">' + data[i].c_INTERF_STATUS_NAME + '</div></td>');
                       html += '</tr>';
				   }

				}
				// ]]>
				$("#tbl tbody").html(html);
            })
		};
		$(document).ready(function () {

		    queryForList(null);
			$("#btn-search").on("click" , function () {
                c_APP_ID = $("#c_APP_ID").val();
                c_INTERF_NAME = $("#c_INTERF_NAME").val();
                c_INTERF_STATUS = $("#c_INTERF_STATUS").val();
				queryForList();
            });


        });
	</script>
</body>

</html>

